/**
 * @description: 拖动函数
 * @param {any} resize
 * @param {any} left
 * @param {any} right
 * @param {any} container
 * @return {*}
 */
const drag: any = (resize: any, left: any, right: any, container: any) => {
  // let resize: any = document.getElementById("resize");
  // let left: any = document.getElementById("left");
  // let right: any = document.getElementById("right");
  // let container: any = document.getElementById("container");

  //console.log(resize);

  resize.onmousedown = function (e: any) {
    // 记录鼠标按下时的x轴坐标
    let preX = e.clientX;
    //  console.log(preX);

    resize.left = resize.offsetLeft;

    // console.log(resize.offsetLeft, "offsetLeft");

    // console.log(resize.left)

    document.onmousemove = function (e) {
      let curX = e.clientX;

      // console.log(curX, 'curX')

      let deltaX = curX - preX;

      // console.log(deltaX, 'deltaX')

      let leftWidth = resize.left + deltaX;

      // 左边区域的最小宽度限制为64px
      if (leftWidth < 150) leftWidth = 150;
      // 右边区域最小宽度限制为150px
      if (leftWidth > container.clientWidth - 150)
        leftWidth = container.clientWidth - 150;

      //设置左边区域的宽度
      left.style.width = leftWidth + "px";
      // 设备分栏竖条的left位置
      resize.style.left = leftWidth;
      // 设置右边区域的宽度
      right.style.width = container.clientWidth - leftWidth - 4 + "px";

      console.log(container.clientWidth);
    };

    document.onmouseup = function (e) {
      console.log("执行onmouseup");
      document.onmousemove = null;
      document.onmouseup = null;
    };
  };
};

//问答区隐藏函数
const ps: any = (r: any, l: any, container: any) => {
  r.style.width = 64 + "px";
  l.style.width = container.clientWidth - 64 + "px";
};

//问答区隐藏函数
const ms: any = (r: any, l: any, container: any) => {
  r.style = 200 + "px";

  l.style.width = container.clientWidth - 4 - 200 + "px";
};

export { drag, ps, ms };
